<template>
	<view>
		<block>
			<view class="address">
				<view class="img">
					<image src="https://wx.2024csnl.com/static/img/address3.png"></image>
				</view>
				<view class="info">
					<text class="t1">{{order.linkman}} {{order.tel}}</text>
					<text class="t2"
						v-if="order.freight_type!=1 && order.freight_type!=3">地址：{{order.area}}{{order.address}}</text>
					<text class="t2" v-if="order.freight_type==1" @tap="openLocation"
						:data-address="order.storeinfo.address" :data-latitude="order.storeinfo.latitude"
						:data-longitude="order.storeinfo.longitude">取货地点：{{order.storeinfo.name}} -
						{{order.storeinfo.address}}</text>
				</view>
			</view>
			<view class="product">
				<view v-for="(item, idx) in order.prolist" :key="idx" class="content">
					<view>
						<image :src="item.pic"></image>
					</view>
					<view class="detail">
						<text class="t1">{{item.name}}</text>
						<text class="t2">{{item.ggname}}</text>
						<view class="t3"><text class="x1 flex1">￥{{item.sell_price}}</text><text class="x2"
								v-if="type !='cycle'">×{{item.num}}</text></view>
					</view>
				</view>
			</view>

			<view class="orderinfo"
				v-if="(order.status==3 || order.status==2) && (order.freight_type==3 || order.freight_type==4)">
				<view class="item flex-col">
					<text class="t1" style="color:#111">发货信息</text>
					<text class="t2" style="text-align:left;margin-top:10rpx;padding:0 10rpx" user-select="true"
						selectable="true">{{order.freight_content}}</text>
				</view>
			</view>

			<view class="orderinfo">
				<view class="item">
					<text class="t1">下单人</text>
					<text class="flex1"></text>
					<image :src="order.headimg" style="width:80rpx;height:80rpx;margin-right:8rpx" />
					<text style="height:80rpx;line-height:80rpx">{{order.nickname}}</text>
				</view>
				<view class="item">
					<!-- <text class="t1">{{t('会员')}}ID</text> -->
					<text class="t2">{{order.mid}}</text>
				</view>
			</view>
			<view class="orderinfo" v-if="order.remark">
				<view class="item">
					<text class="t1">备注</text>
					<text class="t2">{{order.remark}}</text>
				</view>
			</view>
			<view class="orderinfo">
				<view class="item">
					<text class="t1">订单编号</text>
					<text class="t2" user-select="true" selectable="true">{{order.ordernum}}</text>
				</view>
				<view class="item">
					<text class="t1">下单时间</text>
					<text class="t2">{{order.createtime}}</text>
				</view>
				<view class="item" v-if="order.status>0 && order.paytypeid!='4' && order.paytime">
					<text class="t1">支付时间</text>
					<text class="t2">{{order.paytime}}</text>
				</view>
				<view class="item" v-if="order.status>0 && order.paytime">
					<text class="t1">支付方式</text>
					<text class="t2">{{order.paytype}}</text>
				</view>
				<view class="item" v-if="order.status>1 && order.send_time">
					<text class="t1">发货时间</text>
					<text class="t2">{{order.send_time}}</text>
				</view>
				<view class="item" v-if="order.status==3 && order.collect_time">
					<text class="t1">收货时间</text>
					<text class="t2">{{order.collect_time}}</text>
				</view>
			</view>
			<view class="orderinfo">
				<view class="item" v-if="type=='cycle'">
					<text class="t1">总配送期数</text>
					<text class="t2 red">共{{order.qsnum}}期</text>
				</view>
				<view class="item" v-if="type=='cycle'">
					<text class="t1">当前配送期数</text>
					<text class="t2 red">第{{order.stage.cycle_number}}期</text>
				</view>
				<view class="item" v-if="type=='cycle'">
					<text class="t1">每期数量</text>
					<text class="t2 red">共{{order.stage.num}}件</text>
				</view>
				<view class="item">
					<text class="t1">商品金额</text>
					<text class="t2 red">¥{{order.product_price}}</text>
				</view>
				<view class="item" v-if="order.disprice > 0">
					<!-- <text class="t1">{{t('会员')}}折扣</text> -->
					<text class="t2 red">-¥{{order.leveldk_money}}</text>
				</view>
				<view class="item" v-if="order.jianmoney > 0">
					<text class="t1">满减活动</text>
					<text class="t2 red">-¥{{order.manjian_money}}</text>
				</view>
				<view class="item">
					<text class="t1">配送方式</text>
					<text class="t2">{{order.freight_text}}</text>
				</view>
				<view class="item" v-if="order.freight_type==1 && order.freightprice > 0">
					<text class="t1">服务费</text>
					<text class="t2 red">+¥{{order.freight_price}}</text>
				</view>
				<view class="item" v-if="order.freight_time">
					<text class="t1">{{order.freight_type!=1?'配送':'提货'}}时间</text>
					<text class="t2">{{order.freight_time}}</text>
				</view>
				<view class="item" v-if="order.couponmoney > 0">
					<text class="t2 red">-¥{{order.coupon_money}}</text>
				</view>

				<view class="item" v-if="order.scoredk > 0">
					<text class="t2 red">-¥{{order.scoredk_money}}</text>
				</view>
				<view class="item">
					<text class="t1">实付款</text>
					<text class="t2 red">¥{{order.totalprice}}</text>
				</view>

				<view class="item">
					<text class="t1">订单状态</text>
					<text class="t2" v-if="order.status==0">未付款</text>
					<text class="t2" v-if="order.status==1">已付款</text>
					<text class="t2" v-if="order.status==2">已发货</text>
					<text class="t2" v-if="order.status==3">已收货</text>
					<text class="t2" v-if="order.status==4">已关闭</text>
				</view>
				<view class="item" v-if="order.refund_status>0">
					<text class="t1">退款状态</text>
					<text class="t2 red" v-if="order.refund_status==1">审核中,¥{{order.refund_money}}</text>
					<text class="t2 red" v-if="order.refund_status==2">已退款,¥{{order.refund_money}}</text>
					<text class="t2 red" v-if="order.refund_status==3">已驳回,¥{{order.refund_money}}</text>
				</view>
				<view class="item" v-if="order.refund_status>0">
					<text class="t1">退款原因</text>
					<text class="t2 red">{{order.refund_reason}}</text>
				</view>
				<view class="item" v-if="order.refund_checkremark">
					<text class="t1">审核备注</text>
					<text class="t2 red">{{order.refund_checkremark}}</text>
				</view>

				<view class="item">
					<text class="t1">备注</text>
					<text class="t2 red">{{order.message ? order.message : '无'}}</text>
				</view>
				<view class="item" v-if="order.field1">
					<text class="t1">{{order.field1data[0]}}</text>
					<text class="t2 red">{{order.field1data[1]}}</text>
				</view>
				<view class="item" v-if="order.field2">
					<text class="t1">{{order.field2data[0]}}</text>
					<text class="t2 red">{{order.field2data[1]}}</text>
				</view>
				<view class="item" v-if="order.field3">
					<text class="t1">{{order.field3data[0]}}</text>
					<text class="t2 red">{{order.field3data[1]}}</text>
				</view>
				<view class="item" v-if="order.field4">
					<text class="t1">{{order.field4data[0]}}</text>
					<text class="t2 red">{{order.field4data[1]}}</text>
				</view>
				<view class="item" v-if="order.field5">
					<text class="t1">{{order.field5data[0]}}</text>
					<text class="t2 red">{{order.field5data[1]}}</text>
				</view>
			</view>
		</block>
		<view style="height:140rpx"></view>
		<view class="btn-add" @tap="onImmediatelyHeXiao">立即核销</view>
	</view>
</template>

<script>
	import {
		busHeXiao,
		// immediatelyHeXiao
	} from "@/api/index.js"
	export default {
		data() {
			return {
				opt: {},
				isload: false,
				type: '',
				order: {},
				nodata: false,
				nomore: false
			};
		},
		onLoad(opt) {
			this.opt = opt
			this.type = opt.type;
			this.getdata();
		},
		onPullDownRefresh() {
			this.getdata();
		},
		methods: {
			onBakc(){
				setTimeout(() => {
					uni.reLaunch({
						url: '/package/mine/businessCenter'
					})
				},2000)
			},
			async onImmediatelyHeXiao() {
				const res = await busHeXiao('s=ApiAdminHexiao/hexiao', {
					type: this.type,
					co: this.opt.co,
					op: 'confirm',
				})
				const {
					status,
					order,
					msg
				} = res.data
				this.showToast(msg)
				if (status == 1) {
					this.onBakc()
					// console.log(res, "ressss22---")
				}
			},
			// 数据
			async getdata() {
				const res = await busHeXiao('s=ApiAdminHexiao/hexiao', {
					type: this.type,
					co: this.opt.co
				})
				const {
					status,
					order,
					msg
				} = res.data

				if (status == 1) {
					// console.log(res, "res---")
					this.order = order
					// this.loaded();
				} else {
					this.showToast(msg)
					// this.onBakc()
				}
			},
		}
	};
</script>
<style>
	view {
		box-sizing: border-box;
		overflow: visible
	}

	text {
		box-sizing: border-box;
	}

	input {
		box-sizing: border-box;
	}

	image {
		box-sizing: border-box;
	}

	picker {
		box-sizing: border-box;
	}

	icon {
		box-sizing: border-box;
	}

	label {
		box-sizing: border-box;
	}

	textarea {
		box-sizing: border-box;
	}

	video {
		box-sizing: border-box;
	}

	scroll-view {
		box-sizing: border-box;
	}

	page {
		font-size: 28rpx;
		background: #f6f6f6
	}

	button {
		padding-left: 0;
		padding-right: 0;
		background-color: transparent;
		font-size: 28rpx;
		border: 0;
		border-radius: 0;
		overflow: visible;
	}

	button::after {
		border: none;
	}

	.button-view {
		text-align: left;
		font-size: 28rpx;
		line-height: 1.4;
	}

	.button-view::after {
		width: 0;
		height: 0;
	}

	.button-view-hover {
		background-color: transparent;
	}

	.tabbarbot {
		bottom: 110rpx !important
	}

	@supports (bottom: env(safe-area-inset-bottom)) {
		.tabbarbot {
			margin-bottom: env(safe-area-inset-bottom);
		}
	}

	@supports (bottom: env(safe-area-inset-bottom)) {
		.notabbarbot {
			padding-bottom: env(safe-area-inset-bottom) !important;
		}
	}

	@supports (bottom: env(safe-area-inset-bottom)) {
		.notabbarbot2 {
			bottom: env(safe-area-inset-bottom) !important;
		}
	}

	.flex {
		display: flex;
	}

	.flex1 {
		flex-grow: 1;
		flex-shrink: 1;
	}

	.flex0 {
		flex-grow: 0;
		flex-shrink: 0;
	}

	.flex-row {
		display: flex;
		flex-direction: row;
	}

	.flex-col {
		display: flex;
		flex-direction: column;
	}

	.flex-x-center {
		display: flex;
		justify-content: center;
	}

	.flex-y-center {
		display: flex;
		align-items: center;
	}

	.flex-y-bottom {
		display: flex;
		align-items: flex-end;
	}

	.flex-bt {
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-box;
		display: -webkit-flex;
		display: box;
		display: flexbox;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.flex-xy-center {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.flex-x-bottom {
		display: flex;
		justify-content: flex-end;
	}

	.flex-wp {
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-box;
		display: -webkit-flex;
		display: box;
		display: flexbox;
		display: flex;
		flex-wrap: wrap;
	}

	.popup__container {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: auto;
		z-index: 10;
		background: #fff
	}

	.popup__overlay {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 100%;
		z-index: 11;
		opacity: 0.3;
		background: #000
	}

	.popup__modal {
		width: 100%;
		position: absolute;
		bottom: 0;
		color: #3d4145;
		overflow-x: hidden;
		overflow-y: hidden;
		opacity: 1;
		padding-bottom: 20rpx;
		background: #fff;
		border-radius: 20rpx 20rpx 0 0;
		z-index: 12;
		min-height: 600rpx;
		max-height: 1000rpx;
	}

	.popup__title {
		text-align: center;
		padding: 30rpx;
		position: relative;
		position: relative
	}

	.popup__title-text {
		font-size: 32rpx
	}

	.popup__close {
		position: absolute;
		top: 34rpx;
		right: 34rpx
	}

	.popup__content {
		width: 100%;
		max-height: 880rpx;
		overflow-y: scroll;
		padding: 20rpx 0;
	}

	.wxfaceimg {
		width: 50rpx;
		height: 50rpx
	}

	.copyright {
		width: 100%;
		line-height: 40rpx;
		color: #C9C9C9;
		font-size: 26rpx;
		text-align: center;
		white-space: pre;
		padding: 30rpx 0
	}

	.address {
		display: flex;
		width: 100%;
		padding: 20rpx 3%;
		background: #FFF;
		margin-bottom: 20rpx;
	}

	.address .img {
		width: 40rpx
	}

	.address image {
		width: 40rpx;
		height: 40rpx;
	}

	.address .info {
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	.address .info .t1 {
		font-size: 28rpx;
		font-weight: bold;
		color: #333
	}

	.address .info .t2 {
		font-size: 24rpx;
		color: #999
	}

	.product {
		width: 100%;
		padding: 14rpx 3%;
		background: #FFF;
	}

	.product .content {
		display: flex;
		position: relative;
		width: 100%;
		padding: 16rpx 0px;
		border-bottom: 1px #e5e5e5 dashed;
	}

	.product .content:last-child {
		border-bottom: 0;
	}

	.product .content image {
		width: 140rpx;
		height: 140rpx;
	}

	.product .content .detail {
		display: flex;
		flex-direction: column;
		margin-left: 14rpx;
		flex: 1
	}

	.product .content .detail .t1 {
		font-size: 26rpx;
		line-height: 36rpx;
		margin-bottom: 10rpx;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.product .content .detail .t2 {
		height: 46rpx;
		line-height: 46rpx;
		color: #999;
		overflow: hidden;
		font-size: 26rpx;
	}

	.product .content .detail .t3 {
		display: flex;
		height: 40rpx;
		line-height: 40rpx;
		color: #ff4246;
	}

	.product .content .detail .x1 {
		flex: 1
	}

	.product .content .detail .x2 {
		width: 100rpx;
		font-size: 32rpx;
		text-align: right;
		margin-right: 8rpx
	}

	.product .content .comment {
		position: absolute;
		top: 64rpx;
		right: 10rpx;
		border: 1px #ffc702 solid;
		border-radius: 10rpx;
		background: #fff;
		color: #ffc702;
		padding: 0 10rpx;
		height: 46rpx;
		line-height: 46rpx;
	}

	.product .content .comment2 {
		position: absolute;
		top: 64rpx;
		right: 10rpx;
		border: 1px #ffc7c2 solid;
		border-radius: 10rpx;
		background: #fff;
		color: #ffc7c2;
		padding: 0 10rpx;
		height: 46rpx;
		line-height: 46rpx;
	}

	.orderinfo {
		width: 100%;
		margin-top: 10rpx;
		padding: 14rpx 3%;
		background: #FFF;
	}

	.orderinfo .item {
		display: flex;
		width: 100%;
		padding: 20rpx 0;
		border-bottom: 1px dashed #ededed;
	}

	.orderinfo .item:last-child {
		border-bottom: 0;
	}

	.orderinfo .item .t1 {
		width: 200rpx;
	}

	.orderinfo .item .t2 {
		flex: 1;
		text-align: right;
	}

	.orderinfo .item .textarea {
		text-align: left;
		white-space: pre-wrap;
		padding: 20rpx;
	}

	.orderinfo .item .red {
		color: red
	}

	.orderinfo .topitem {
		display: flex;
		padding: 60rpx 40rpx;
		align-items: center;
		border-bottom: 2px dashed #E5E5E5;
		position: relative
	}

	.orderinfo .topitem .f1 {
		font-size: 50rpx;
		font-weight: bold;
	}

	.orderinfo .topitem .f1 .t1 {
		font-size: 60rpx;
	}

	.orderinfo .topitem .f1 .t2 {
		font-size: 40rpx;
	}

	.orderinfo .topitem .f2 {
		margin-left: 40rpx
	}

	.orderinfo .topitem .f2 .t1 {
		font-size: 36rpx;
		color: #2B2B2B;
		font-weight: bold;
		height: 50rpx;
		line-height: 50rpx
	}

	.orderinfo .topitem .f2 .t2 {
		font-size: 24rpx;
		color: #999999;
		height: 50rpx;
		line-height: 50rpx;
	}

	.btn-add {
		width: 90%;
		max-width: 700px;
		margin: 0 auto;
		height: 96rpx;
		line-height: 96rpx;
		text-align: center;
		color: #fff;
		background: #F41717;
		font-size: 30rpx;
		font-weight: bold;
		border-radius: 40rpx;
		position: fixed;
		left: 0px;
		right: 0;
		bottom: 20rpx;
	}
</style>
